<template>
  <div>
    <el-dialog
      title="开药"
      :visible.sync="dialogVisible"
      append-to-body
      width="60%"
      class="dialog"
      element-loading-background="rgba(0, 0, 0, 0.8)"
      :before-close="handleClose"
      :close-on-click-modal="false"
      center
    >
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="西药" name="001"></el-tab-pane>
        <el-tab-pane label="中成药" name="002"></el-tab-pane>
        <el-tab-pane label="中草药" name="003"></el-tab-pane>
      </el-tabs>

      <el-table
        :data="tableData"
        border
        stripe
        style="width: 100%"
        max-height="500"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="name" align="center" label="药品名称">
        </el-table-column>
        <el-table-column prop="price" align="center" label="药品单价">
        </el-table-column>
        <el-table-column
          prop="introduce"
          align="center"
          show-overflow-tooltip
          label="药品介绍"
        >
        </el-table-column>
        <el-table-column
          prop="guide"
          align="center"
          show-overflow-tooltip
          label="药品规格"
        >
        </el-table-column>
        <el-table-column prop="ingredient" align="center" label="药品成分">
        </el-table-column>
        <el-table-column
          prop="feature"
          align="center"
          show-overflow-tooltip
          label="功能主治/适应症"
        >
        </el-table-column>
        <el-table-column prop="save" align="center" label="存储条件">
        </el-table-column>
        <el-table-column
          prop="guide"
          align="center"
          show-overflow-tooltip
          label="用药指导"
        >
        </el-table-column>
      </el-table>
      <div v-for="item in selectArr" :key="item.id">
        <el-divider>{{ item.name }}</el-divider>
        <el-form ref="form" label-width="120px">
          <el-form-item
            :label="
              item.DrugClassCode == '西药' ? '药品数量(盒)' : '药品数量(g)'
            "
          >
            <el-input v-model="item.num"></el-input>
          </el-form-item>
          <!--      <el-form-item label="频率(天/次)">
            <el-input v-model="item.days"></el-input>
          </el-form-item> -->
          <el-form-item label="剂量">
            <el-input v-model="item.dosage"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer">
        <el-button @click="onClose">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { ApiGetOrderInfo, ApiGetMedicineList } from "../../../api/index";
export default {
  name: "prescribing",
  props: ["id"],
  data() {
    return {
      activeName: "西药",
      dialogVisible: false,
      ruleForm: {
        ICD: "",
        ICD1: "",
        type: "",
        main: "",
      },
      tableData: [],
      list: [
        {
          id: "1",
          name: "鼠疫",
          code: "SY",
          checked: false,
        },
        {
          id: "2",
          name: "炭疽",
          code: "TJ",
          checked: false,
        },
        {
          id: "3",
          name: "鼻疽",
          code: "BJ",
          checked: false,
        },
        {
          id: "4",
          name: "麻风",
          code: "MF",
          checked: false,
        },
        {
          id: "5",
          name: "伤寒",
          code: "SH",
          checked: false,
        },
        {
          id: "6",
          name: "霍乱",
          code: "HL",
          checked: false,
        },
        {
          id: "7",
          name: "肾结核",
          code: "SJH",
          checked: false,
        },
        {
          id: "8",
          name: "肠结核",
          code: "CJH",
          checked: false,
        },
        {
          id: "9",
          name: "眼结核",
          code: "YJH",
          checked: false,
        },
        {
          id: "10",
          name: "舌结核",
          code: "SJH",
          checked: false,
        },
      ],
      rules: {
        type: [{ required: true, message: "请选择", trigger: "change" }],
        ICD: [{ required: true, message: "请选择", trigger: "change" }],
        ICD1: [{ required: true, message: "请选择", trigger: "change" }],
        disease: [{ required: true, message: "请选择", trigger: "change" }],
        main: [{ required: true, message: "请输入主诉", trigger: "input" }],
      },
      form: { name: "" },
      selectArr: [],
    };
  },
  methods: {
    handleClick(tab) {
      console.log(tab.name);
      this.getMedicineList(tab.name);
    },
    show() {
      this.dialogVisible = true;
      this.getMedicineList("001");
    },

    getMedicineList(DrugClassCode) {
      ApiGetMedicineList({ DrugClassCode,page:1,size:999 }).then((res) => {
        this.tableData = res.data;
      });
    },
    handleSelectionChange(e) {
      this.selectArr = e;
    },
    //导入患者描述信息
    /*  importPatientInfo() {
 
     } */
    importPatientInfo() {
      ApiGetOrderInfo(this.id).then((res) => {
        this.ruleForm.main = res.data.patient_status;
      });
    },
    handleClose() {
      this.dialogVisible = false;
    },
    //开药
    medicineClick() {
      this.$refs.medicine.show();
    },
    submit() {
      /*      console.log(this.selectArr) */
      this.$emit("selectArr", this.selectArr);
      this.dialogVisible = false;
    },
    onClose() {
      this.dialogVisible = false;
    },
  },
};
</script>

<style>
</style>